<template>
  <div class="son1">
    子组件1
    <br>
    {{ this.$store.state.count }}
    <br>
    <button @click="addOne(1)">n+1</button>
    <button @click="delayChange(1111)">1秒后变为1111</button>
    <br>
    {{ this.$store.getters.filter }}
    <br>
    {{ this.$store.state.user.userName }}
  </div>
</template>

<script>
import {mapState,mapMutations} from 'vuex'
export default {
    name:'MySon1',
    methods:{
        addOne(value){
            // console.log(mapState);
            // console.log(mapMutations);
            this.$store.commit('funAddOne',value)
        },
        delayChange(value){
            this.$store.dispatch('changeOne',value)
        }
    }
}
</script>

<style>
.son1 {
    border: 3px solid black;
    width: 400px;
}
</style>